<!--友情链接-->
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>个人中心</title>
    <link rel="stylesheet" href="../css/personal_center.css">
    <link rel="stylesheet" href="../css/common.css">
    <link rel="stylesheet" href="../css/style_zj.css">
    <link rel="stylesheet" href="../layui/css/layui.css">
    <link rel="stylesheet" href="../fonts/iconfont.css">
    <!--<link rel="stylesheet" href="../less/laypage.css">-->
    <style>
        .active1 {
            color: #fb6a30 !important;
        }

        .offer_price_mask {
            background-color: #000;
            opacity: 0.6;
            position: fixed;
            top: 0;
            width: 100%;
            height: 100%;
            z-index: 20;
        }

        .content_offer_price {
            background-color: #fff;
            position: fixed;
            width: 800px;
            height: 360px;
            z-index: 35;
            left: 50%;
            margin-left: -400px;
            top: 50%;
            margin-top: -180px;
        }

        .content_offer_price .title {
            line-height: 45px;
            background: #eee;
            padding-left: 10px;
            margin-bottom: 20px;
        }

        .content_offer_price .list {
            padding: 0 10px;
            margin-bottom: 20px;
        }
        .content_offer_price table{
            margin-top: 10px;
            width: 100%;
        }
        .content_offer_price table th{
            background-color: #f1f1f1;
        }
        .content_offer_price table th,.content_offer_price table td{
            height: 38px;
            text-align: center;
            border: 1px solid #eee;
            padding: 5px;
        }
        .dis-inblock {
            display: inline-block;
        }
    </style>
</head>
<body>
<div class="offer_price_mask hide"></div>
<!--<div id="header_01_html">
    <iframe id="header_01" src="head_01.html" frameborder="0"></iframe>
</div>-->
<div class="content-box">
    <!--<div id="left_tab_html">
        <iframe id="left_tab" src="left_tab.html?x=2&y=3" frameborder="0"></iframe>
    </div>-->
    <div class="right-box layui-form" id="vue-box" v-cloak>


        <div class="content_offer_price hide content_offer_price_01">
            <div class="title"><span class="c_000">去报价</span><span class="icon_close close_mode"></span></div>
            <div class="clearfix showInquireDetail">

                <div class="fl mr-28">
                    <div class="fl"><img :src="imgBaseUrl + userUrl" v-if="userUrl" alt="" class="img-sty1"><img v-if="!userUrl" src="../img/store-home.jpg" alt="" class="img-sty1"></div>
                    <div class="fl">
                        <div class="mb10 c_000">{{storeName}}<span class="icon_store_sty" style="top:3px;left: 10px;"></span></div>
                        <div class="c_000">询价时间： <span class="c_666">{{crtTime}}</span></div>
                    </div>
                </div>
                <div class="fl">
                    <div class="fl">
                        <div class="c_000 mb10">公司地址： <span class="c_666">{{address}}</span></div>
                        <div class="c_000">询价清单： <span class="c_666">{{name}}</span></div>
                    </div>
                </div>
                <div class="fr link-right">
                    <div class="text-c">
                        <a target="_blank" :href="'http://wpa.qq.com/msgrd?v=3&uin='+qq+'&site=qq&menu=yes'">
                            <img src="../img/QQ.png" class="qq-box1" align="absmiddle">
                        </a>
                    </div>
                    <div class="text-c c_000">联系对方</div>
                </div>
            </div>
            <div class="list" v-if="hideModal">
                <!--<span>填写价格：</span>-->
                <table>
                    <thead>
                    <tr>
                        <th>询价清单</th>
                        <th>报价</th>

                    </tr>
                    </thead>
                    <tbody>
                    <tr>
                        <td>{{name}}</td>
                        <td>
                            <div class="dis-inblock">
                                <input type="text" class="layui-input js-getAmount" placeholder="填写您的报价">
                            </div>
                        </td>

                    </tr>
                    </tbody>
                </table>


            </div>
            <div v-if="hideModal">
                <div class="text-c"><span class="btn-sty11 js-offerPrice">提交报价</span></div>
            </div>
        </div>

        <div class="content_offer_price hide content_offer_price_02">
            <div class="title"><span class="c_000">待报价详情</span><span class="icon_close close_mode"></span></div>
            <div class="clearfix showInquireDetail">

                <div class="fl mr-28">
                    <div class="fl">
                        <img :src="imgBaseUrl + userUrl" v-if="userUrl" alt="" class="img-sty1"><img v-if="!userUrl" src="../img/store-home.jpg" alt="" class="img-sty1">
                    </div>
                </div>
                <div class="fl">
                    <div class="fl">
                        <div class="c_000 mb10">公司地址： <span class="c_666">{{address}}</span></div>
                        <div class="c_000">询价清单： <span class="c_666">{{name}}</span></div>
                    </div>
                </div>
                <div class="fr link-right">
                    <div class="text-c">
                        <a target="_blank" :href="'http://wpa.qq.com/msgrd?v=3&uin='+qq+'&site=qq&menu=yes'">
                            <img src="../img/QQ.png" class="qq-box1" align="absmiddle">
                        </a>
                    </div>
                    <div class="text-c c_000">联系对方</div>
                </div>
            </div>
            <div class="clearfix showInquireDetail" style="border-top: 1px solid #e5e5e5;padding: 15px 10px;">
                <div class="fl">
                    <div class="c_000 mb10">公司地址： <span class="c_666">{{address}}</span></div>
                    <div class="c_000">询价清单： <span style="color: #fb6a30;">{{name}}</span></div>
                </div>
            </div>
        </div>

        <div class="content-admin">
            <div class="title-toggle">
                <div class="item "><a href="my_ok_offer.html">已报价</a></div>
                <div class="item active">待报价</div>
            </div>
            <div>
                <div class="table-list">
                    <table>
                        <thead>
                        <tr>
                            <th>产品信息标题</th>
                            <th>品类</th>
                            <th class="js-allCheck width_130">
                                图片
                            </th>

                            <th class="width_170">询价时间</th>
                            <th class="width_100">状态</th>
                            <th class="width_120">操作</th>
                        </tr>
                        </thead>
                        <tbody>
                        <tr v-for="(item,index) in pagList">
                            <td>{{item.name}}</td>
                            <td>{{item.commodityType}}</td>
                            <td class="js-onlyCheck p-r">
                                <img :src="imgBaseUrl + item.picUrl" alt="" class="img-sty"></td>
                            </td>
                            <td>{{item.crtTime}}</td>
                            <td>{{item.state==0?'上架':'下架'}}</td>
                            <td>
                                <!--<div class="colo-blue cur-p">查看详情</div>-->
                                <!--<div class="colo-blue cur-p" @click="operation(item.state,item.id)">{{item.state==0?'关闭询价':'打开询价'}}</div>-->
                                <div class="colo-blue cur-p" :data-value="type"
                                     @click="offerProduct(type,item.id,item.storeName,item.crtTime,item.qq,item.storeId,item.name,item.userUrl,item.productionPlace)">去报价
                                </div>
                                <div class="colo-blue cur-p" :data-value="type0" @click="offerProduct(type0,item.id,item.storeName,item.crtTime,item.qq,item.storeId,item.name,item.userUrl,item.productionPlace)">
                                    查看详情
                                </div>
                            </td>
                        </tr>
                        </tbody>
                    </table>
                    <div id="test1" class="text-r"></div>
                </div>
            </div>
        </div>
    </div>
</div>
<!--
<div>
    <iframe src="footer-record.html" style="width: 100%;border: none;height:60px;"></iframe>
</div>-->
<script src="../js/config.js"></script>
<script>
    var postData = {
        limit: 5,
        offset: 1,
        type: '',
        name: '',
    }

    var app = new Vue({
        el: '#vue-box',
        data: {
            type:1,
            type0:0,
            pagList: '',
            imgBaseUrl: imgBaseUrl,
            id: '',
            storeName: '',
            crtTime: '',
            qq: '',
            storeId: '',
            name:'',
            userUrl:'',
            address:'',
            hideModal:true,

        },
        mounted: function () {
            this.getPage();
        },
        updated: function () {

        },
        methods: {
            getPage: function () {
                var that = this;
                get_ajaxPage("/quotation/geQuotationPage", postData, function (data) {
                    data.data.forEach(function (item) {
                        item.picUrl = item.picUrl.split(",")[0];
                    })
                    that.pagList = data.data;
                    layui.use('laypage', function () {
                        var laypage = layui.laypage;
                        //执行一个laypage实例
                        laypage.render({
                            elem: 'test1'
                            , count: data.count //数据总数，从服务端得到
                            , limit: postData.limit
                            , jump: function (obj, first) {
                                //obj包含了当前分页的所有参数，比如：
                                console.log(obj.curr); //得到当前页，以便向服务端请求对应页的数据。
                                console.log(obj.limit); //得到每页显示的条数

                                //首次不执行
                                if (!first) {
                                    //do something
                                    postData.offset = obj.curr;
                                    get_ajaxPage("/quotation/geQuotationPage", postData, function (data) {
                                        data.data.forEach(function (item) {
                                            item.picUrl = item.picUrl.split(",")[0];
                                        })
                                        that.pagList = data.data;
                                    })
                                }
                            }
                        });
                    });
                })


            },
            operation: function (state, id) {
                if (state == 0) {
                    get_ajax("/sys/storeCommodity/del", {ids: id}, function (data) {
                        layer.msg('操作成功！');
                        app.getPage();
                    })
                } else {
                    get_ajax("/sys/storeCommodity/grounding", {ids: id}, function (data) {
                        layer.msg('操作成功！');
                        app.getPage();
                    })
                }
            },
            offerProduct: function (type,id, storeName, crtTime, qq, storeId,name,userUrl,address) {
                if(type==1){
                    this.hideModal = true;
                    $('.content_offer_price_01,.offer_price_mask').fadeIn();
                }else{
                    this.hideModal = false;
                    $('.content_offer_price_02,.offer_price_mask').fadeIn();
                }
                this.id = id;

                this.storeName = storeName;
                this.crtTime = crtTime;
                this.qq = qq;
                this.storeId = storeId;
                this.name = name;
                this.userUrl = userUrl;
                this.address = address;
            }


        }
    });
    $('.offer_price_mask,.icon_close').click(function () {
        $('.content_offer_price,.offer_price_mask').fadeOut();
    })
    $('.js-offerPrice').click(function () {
        if(!$('.js-getAmount').val()){
            layer.msg('请填写报价！');
            return
        }
        get_ajax("/quotation/add", {commodityId: app.id, amount: $('.js-getAmount').val()}, function (data) {
            layer.msg('报价成功！');
            app.getPage();
            $('.content_offer_price,.offer_price_mask').fadeOut();
        })
    })


</script>
</body>
</html>
